Ext.Loader.setConfig({
			enabled : true
		})
Ext.Loader.setPath('Ext.ux', '/ssm/js/extjs/packages/ux')
Ext
		.require(['Ext.grid.*', 'Ext.toolbar.Paging', 'Ext.data.*',
				'Ext.ux.form.SearchField', 'Ext.util.*',
				'Ext.selection.CheckboxModel']);
Ext.onReady(function() {
			Ext.define('MyData', {
						extend : 'Ext.data.Model',
						fields : [{name:'ID',type:'int'} ,'NAME', 'AUTHOR', 'PRICE', 'PUBLISHDATE',
								'ADDRESS', 'TYPE_NAME']
					});

			var store = Ext.create('Ext.data.Store', {
						pageSize : 10,
						model : 'MyData',
						remoteSort : true,
						proxy : {
							type : 'ajax',
							url : 'queryBookList',
							reader : {
								root : 'list',
								totalProperty : 'total'
							},
							simpleStoreModel : true
						},
						sorters : [{
									property : 'publishdate',
									direction : 'desc'
								}]
					});
			var selModel = Ext.create('Ext.selection.CheckboxModel');
			var grid = Ext.create('Ext.grid.Panel', {
						store : store,
						selModel : selModel,
						columnLines : true,
						columns : [{
									text : '基本信息',
									columns : [{
												text : '作者',
												width : 120,
												dataIndex : 'AUTHOR',
												sortable : true
											}, {
												text : '书名',
												width : 120,
												dataIndex : 'NAME',
												sortable : true
											}, {
												text : '价格',
												width : 120,
												dataIndex : 'PRICE',
												sortable : true
											}, {
												text : '出版日期',
												width : 120,
												dataIndex : 'PUBLISHDATE',
												sortable : true
											}, {
												text : '出版地址',
												width : 120,
												dataIndex : 'ADDRESS',
												sortable : true
											}]
								}, {
									text : '类型',
									width : 120,
									dataIndex : 'TYPE_NAME',
									sortable : true
								}],
						width : '100%',
						title : 'grid分页',
						disableSelection : false,
						frame:true,
						loadMask : true,
						renderTo : 'demo',
						viewConfig : {
							id : 'gv',
							trackOver : false,
							stripeRows : false

						},
						dockedItems : [{
							dock : 'top',
							xtype : 'toolbar',
							items : [{
								itemId : 'Button',
								text : '显示所选',
								tooltip : 'Add a new row',
								iconCls : 'add',
								handler : function() {
									var record = grid.getSelectionModel()
											.getSelection();
									if (record.length == 0) {
										Ext.MessageBox.show({
											title : "提示",
											msg : "请先选择您要操作的行!"
												// icon: Ext.MessageBox.INFO
											})
										return;
									} else {
										var ids = "";
										for (var i = 0; i < record.length; i++) {
											ids += record[i].get("ID")
											if (i < record.length - 1) {
												ids = ids + ",";
											}
										}
										Ext.MessageBox.show({
											title : "所选ID列表",
											msg : ids
												// icon: Ext.MessageBox.INFO
											})
									}
								}
							}, {
								width : 300,
								fieldLabel : '搜索',
								labelWidth : 50,
								xtype : 'searchfield',
								store : store
							}]

						}, {
							dock : 'bottom',
							xtype : 'pagingtoolbar',
							store : store,
							pageSize : 25,
							displayInfo : true,
							displayMsg : '显示 {0} - {1} 条，共计 {2} 条',
							emptyMsg : '没有数据'
						}]

					});
			store.loadPage(1);
		})
